﻿@model IEnumerable<AlbumInfoModel>
@{

    ViewData["Title"] = "相册集";
    var imageUrl = "http://photogallery-1252912192.file.myqcloud.com/";
    var thumbUrl = "https://photogallery-1252912192.image.myqcloud.com/";
    var msg = ViewBag.Msg;
}

@*<form id="admin" if-authorized method="post" action="~/album/new/create/">
        <input type="text" name="name" id="name" aria-label="Album name" placeholder="相册名称" required />
        <input type="submit" id="newalbum" data-progress="Creating..." value="新建相册">
    </form>*@

@if (Model.Count() == 0)
{
    <p>尚未建立相簿,请先创建相簿才能上传照片.</p>
}
<div id="my_nanogallery2" data-nanogallery2='{
     "galleryDisplayMode":    "pagination",
        "galleryMaxRows":        3,
        "galleryPaginationMode": "numbers",
       "thumbnailHeight":           280, "thumbnailWidth": 280,
        "thumbnailL1GutterWidth":    40,
        "thumbnailL1GutterHeight":   40,
        "thumbnailStacks":           4,
        "thumbnailStacksTranslateZ": 0.3,
        "thumbnailStacksRotateX":    0.9,
        "galleryBuildInit2":         "perspective_900px|perspective-origin_50% 50%",
        "thumbnailHoverEffect2":     "thumbnail_translateZ_0px_100px_easeOutQuad_400 | thumbnail_rotateX_0deg_10deg_easeOutBack_200 | thumbnail_rotateX_10deg_0deg_delay250_keyframe_hoverin_easeOutBack_400"
      }'>
    @{
        var i = 1;
        foreach (var album in Model)
        {
            if (album.Photos.Count > 0)
            {
                //缩略图
                var thumb = album.CoverPhoto.Replace(imageUrl, thumbUrl) + "-thumb350";
                <a href="" data-ngkind="album" data-ngid="@i" data-ngthumb="@thumb">@string.Concat(@album.Owner, "_", @album.Description)</a>
                var j = 1;

                foreach (var photo in album.Photos)
                {
                    thumb = photo.CDNUrl.Replace(imageUrl, thumbUrl) + "-thumb350";
                    <a href="@photo.CDNUrl" data-ngid="@i@j" data-ngalbumid="@i" data-ngthumb="@thumb">@photo.Name @j/@album.Photos.Count</a>
                    j++;
                }
                 i++;
            }            
        }
    }
</div>
@section head {
    <meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1">

    <link if-authorized rel="stylesheet" href="~/css/admin.scss" />
    <link href="~/lib/nanogallery2-2.0.0/css/nanogallery2.min.css" rel="stylesheet" />
}
@section scripts {
    <script if-authorized src="~/js/admin.js" async></script>
    <script src="~/lib/nanogallery2-2.0.0/jquery.nanogallery2.core.min.js"></script>
    @if (!string.IsNullOrEmpty(msg))
    {
        <script>
        notie.alert({ type: 4, text: '@msg' })
        </script>
    }

}
